<template>
    <view class="content">
        <image class="logo" src="/static/logo.png"></image>
        <van-cell>
            <van-field lable="用户名" value="" placeholder="请输入用户名" required="true" @blur="onBlurUsername" />
        </van-cell>
        <van-cell>
            <van-field lable="密码" value="" placeholder="请输入密码" required="true" @blur="onBlurPassword"/>
        </van-cell>
        <view>
            <van-button type="primary" @click="signin()" round color="#fab623" size="small">
                <span style="color: #000000;font-size: 12px;">登录</span>
            </van-button>
        </view>
    </view>
</template>

<script>
    import api from '@/api/api.js'
    export default {
        data() {
            return {
                title: 'Hello',
                username: '',
                password: ''
            }
        },
        onLoad() {

        },
        methods: {
            onBlurUsername(event) {
                this.username = event.detail.value
            },
            onBlurPassword(event) {
                this.password = event.detail.value
            },
            async signin() {
                const res = await api.activity.signin({
                    username: this.username,
                    password: this.password
                })
                console.log(res)
                if(res.code === 200){
                    uni.setStorageSync("Authorization",res.data)
                    uni.switchTab({
                    	url: "/pages/index/index"
                    })
                }
            }
        }
    }
</script>

<style>
    .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .logo {
        height: 200rpx;
        width: 200rpx;
        margin-top: 200rpx;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 50rpx;
    }

    .text-area {
        display: flex;
        justify-content: center;
    }

    .title {
        font-size: 36rpx;
        color: #8f8f94;
    }
</style>
